<template>
  <el-dialog title="流程基本配置信息" :visible.sync="isVisiable" width="70%" :close-on-click-modal="false" append-to-body
             @close="cacel()">
    <el-container>
      <el-main style="height:60vh">
        <el-form ref="infoForm" label-width="130px" :model="mainInfo" :rules="rules" label-position="right">
          <el-row>
            <el-col :span="12">
              <el-form-item label="流程名称：" prop="flowName">
                <el-input placeholder="流程名称" v-model="mainInfo.flowName" style="width: 400px"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="最新版本：">
                <el-input placeholder="最新版本" v-model="mainInfo.flowEdition" style="width: 200px"
                          :disabled="true"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="23">
              <el-form-item label="业务分类：" prop="sortBusiness">
                <el-select v-model="mainInfo.sortBusiness" placeholder="请选择" :disabled="!typeEdit">
                  <el-option label="业绩合同正职" value="yjhtzbsh"></el-option>
                  <el-option label="合同任务签订" value="htqd"></el-option>
                  <el-option label="合同任务预填报" value="htytb"></el-option>
                  <el-option label="合同任务填报" value="httb"></el-option>
                  <el-option label="奖金分配业务" value="jjfp"></el-option>
                  <el-option label="奖金发放业务" value="jjff"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="23">
              <el-form-item label="业务排序：">
                <el-slider v-model="mainInfo.flowOrder" :step="1" :max="100" show-stops></el-slider>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="23">
              <el-form-item label="业务说明：">
                <el-input placeholder="业务说明" type="textarea" :rows="4" v-model="mainInfo.flowContent"
                          style="width: 98%"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-main>
    </el-container>
    <span slot="footer" class="dialog-footer">
      <!-- <el-button @click="cacel">取消</el-button> -->
      <el-button type="primary" @click="save('infoForm')">保存配置</el-button>
    </span>
  </el-dialog>
</template>

<script>
/**
 * 流程基本配置信息
 * @author 葛伟明
 */
import {getObj, putObj} from '@/api/workflow/wfflowconfig'
import {Message} from "element-ui";
import {mapGetters, mapState} from "vuex";

export default {
  components: {},
  data() {
    return {
      isVisiable: false,
      typeEdit: true,
      mainInfo: {
        flowXmzt: "关",
        flowSfzdfq: "主动"
      },
      rules: {
        flowName: [{required: true, message: "请输入流程名称"}],
        sortBusiness: [{required: true, message: "请选择业务分类"}]
      }
    };
  },
  created: function () {
  },
  mounted() {
  },
  computed: {
    ...mapGetters(['permissions']),
    ...mapState({
      userInfo: (state) => state.user.userInfo,
    }),
  },
  methods: {
    init(id) {
      getObj(id)
        .then((res) => {
          if (res.data.code == "0") {
            this.mainInfo = res.data.data;
            if (this.mainInfo.sortBusiness) {
              this.typeEdit = false;
            } else {
              this.typeEdit = true;
            }
            this.isVisiable = true;
          } else {
            this.$message({
              type: "error",
              message: res.msg,
            });
          }
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "操作错误",
          });
        });
    },
    save(infoForm) {
      this.$refs[infoForm].validate((valid) => {
        if (valid) {
          var info = {};
          info.id = this.mainInfo.id;
          info.flowName = this.mainInfo.flowName;
          info.flowContent = this.mainInfo.flowContent;
          info.sortBusiness = this.mainInfo.sortBusiness;
          info.flowOrder = this.mainInfo.flowOrder;
          info.formOrProgram = "独立程序";
          info.programInterface = this.mainInfo.sortBusiness;
          //增加表单验证...
          this.$confirm("此操作将保存该流程的基本配置信息, 是否继续?", "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          })
            .then(() => {
              putObj(info)
                .then((res) => {
                  if (res.data.code == "0") {
                    Message({
                      message: "配置信息保存成功...",
                      type: "success",
                      duration: 3 * 1000,
                    });
                  } else {
                    Message({
                      message: res.msg,
                      type: "error",
                      duration: 3 * 1000,
                    });
                  }
                })
                .catch((error) => {
                 //console.log(error);
                });
            })
            .catch(() => {
              this.$message({
                type: "info",
                message: "已取消操作",
              });
            });
        }
      });
    },
    cacel() {
      this.$emit("loadData");
    },
  },
};
</script>
